import 'package:flutter/material.dart';
import "package:get/get.dart";

import '../../../components/appbar_widget/appbar_widget.dart';
import '../../../components/loading/svg_loading.dart';
import '../../../components/status/empty.dart';
import '../../../components/status/not_network.dart';
import '../../../config/global_config.dart';
import '../../../controller/network/network_ctrl.dart';
import '../../../model/bean/maintenance_details_bean.dart';
import '../../../utils/screenutil/fit.dart';
import 'ctrl/details_ctrl.dart';

class Details extends StatelessWidget {
  // 导入控制器
  final detailsCtrl = Get.put(DetailsCtrl());
  final _nc = Get.find<NetworkCtrl>();

  // 数据匹配（维保状态）
  Map<int, dynamic> dataSource = {
    0: "待维保",
    1: "已维保",
    2: "未维保",
  };

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBarWidget('维保详情').build(context),
      body: Obx(
        () {
          MaintenanceDetailsBean _data = detailsCtrl.detailsData.value;
          return detailsCtrl.isInitComplete.value
              ? Container(
                  child: Stack(
                    children: [
                      detailsCtrl.MARKSYMBOL.value
                          ? Container(
                              child: SingleChildScrollView(
                                child: Container(
                                  margin: EdgeInsets.only(top: 0),
                                  child: Container(
                                    width: 640.f,
                                    margin: EdgeInsets.only(
                                        top: fit(_nc.topDistance.value)),
                                    color: Colors.white,
                                    child: Column(
                                      children: [
                                        createField(
                                            "电梯注册码", _data.registerCode),
                                        createField("使用位置",
                                            "${_data.buildingNo}/${_data.unitNo}/${_data.shaft}"),
                                        createField(
                                            "维保计划时间",
                                            _data.maintenancePlanDate == null
                                                ? '/'
                                                : _data.maintenancePlanDate),
                                        createField(
                                            "维保完成时间",
                                            _data.maintenanceDate == null
                                                ? '/'
                                                : _data.maintenanceDate),
                                        createImgGroups(
                                          "楼栋门口图片",
                                          detailsCtrl.splitString(
                                              _data.buildingPhotoPath),
                                        ),
                                        createImgGroups(
                                          "电梯井图片",
                                          detailsCtrl.splitString(
                                              _data.shaftPhotoPath),
                                        ),
                                        createField(
                                            "维保状态", dataSource[_data.status],
                                            end: true),
                                      ],
                                    ),
                                  ),
                                ),
                              ),
                            )
                          : Container(
                              width: 640.f,
                              height: double.infinity,
                              child: Center(
                                child: Empty(),
                              ),
                            ),

                      // 网络状态
                      Positioned(top: 0, child: NotNetwork()),
                    ],
                  ),
                )
              : SVGLoading();
        },
      ),
    );
  }

  /*
SingleChildScrollView(
                  child: Container(
                    child: Stack(
                      children: [
                        Container(
                          margin: EdgeInsets.only(top: 10),
                          child: detailsCtrl.MARKSYMBOL.value
                              ? Container(
                                  width: 640.f,
                                  margin: EdgeInsets.only(
                                      top: fit(_nc.topDistance.value)),
                                  color: Colors.white,
                                  child: Column(
                                    children: [
                                      createField("电梯注册码", _data.registerCode),
                                      createField("使用位置",
                                          "${_data.buildingNo}/${_data.unitNo}/${_data.shaft}"),
                                      createField(
                                          "维保计划时间",
                                          _data.maintenancePlanDate == null
                                              ? '/'
                                              : _data.maintenancePlanDate),
                                      createField(
                                          "维保完成时间",
                                          _data.maintenanceDate == null
                                              ? '/'
                                              : _data.maintenanceDate),
                                      createImgGroups(
                                        "楼栋门口图片",
                                        detailsCtrl.splitString(
                                            _data.buildingPhotoPath),
                                      ),
                                      createImgGroups(
                                        "电梯井图片",
                                        detailsCtrl
                                            .splitString(_data.shaftPhotoPath),
                                      ),
                                      createField(
                                          "维保状态", dataSource[_data.status],
                                          end: true),
                                    ],
                                  ),
                                )
                              : Container(
                                  width: 640.f,
                                  height: double.infinity,
                                  child: Text("1213123"),
                                ),
                        ),

                        // 网络状态
                        Positioned(top: 0, child: NotNetwork()),
                      ],
                    ),
                  ),
                )
  * */

  // 创建Field
  // * [label] String|标头|必填
  // * [value] dynamic|内容|必填
  Widget createField(String label, dynamic value, {bool end = false}) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.end,
      children: [
        Container(
          padding: EdgeInsets.symmetric(horizontal: 20.f, vertical: 15.f),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                width: 180.f,
                child: Text(
                  label,
                  style: TextStyle(
                    color: GlobalConfig.assistColor,
                    fontSize: 24.f,
                  ),
                ),
              ),
              Container(
                width: 380.f,
                alignment: Alignment.centerRight,
                child: Text(
                  value.toString(),
                  style: TextStyle(
                    fontSize: 24.f,
                  ),
                ),
              ),
            ],
          ),
        ),
        SizedBox(
          width: end ? 640.f : 620.f,
          height: 1.f,
          child: Container(
            color: GlobalConfig.borderColor,
          ),
        ),
      ],
    );
  }

  // 创建ImgGroups
  // * [label] String|标头|必填
  // * [value] List|图片地址集合|必填
  Widget createImgGroups(String label, List value) {
    List<Widget> createlw(List value) {
      List<Widget> lw = [];
      if (value.length > 0) {
        for (int i = 0; i < value.length; i++) {
          lw.add(
            Container(
              width: 100.f,
              height: 100.f,
              color: Color.fromRGBO(244, 244, 244, 1),
              child: value[i] != null
                  ? InkWell(
                      onTap: () => detailsCtrl.reviewImages(i, value),
                      child: Image(
                        fit: BoxFit.cover,
                        image: NetworkImage("${value[i]}"),
                      ),
                    )
                  : Icon(
                      Icons.photo,
                      color: Colors.black26,
                      size: 40.f,
                    ),
            ),
          );
        }
      } else {
        lw.add(Text("/"));
      }

      return lw;
    }

    return Column(
      crossAxisAlignment: CrossAxisAlignment.end,
      children: [
        Container(
          padding: EdgeInsets.symmetric(horizontal: 20.f, vertical: 15.f),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Container(
                width: 180.f,
                child: Text(
                  label,
                  style: TextStyle(
                    color: GlobalConfig.assistColor,
                    fontSize: 24.f,
                  ),
                ),
              ),
              Container(
                width: 380.f,
                child: Wrap(
                  alignment: WrapAlignment.end,
                  spacing: 5,
                  runSpacing: 5,
                  children: createlw(value),
                ),
              ),
            ],
          ),
        ),
        SizedBox(
          width: 620.f,
          height: 1.f,
          child: Container(
            color: GlobalConfig.borderColor,
          ),
        ),
      ],
    );
  }
}
